﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="KPIAssignDetailForm.aspx.cs" Inherits="FBKPI.Forms.KPIAssignDetailForm" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
        <script type="text/javascript">
            $(document).ready(function () {
                $("#divBrowseKPI").hide();
                $("#divBrowseKPI").dialog({ autoOpen: false, width: 900, height: 500, modal: true, resizable: false });
                $("#divBrowseEmployee").hide();
                $("#divBrowseEmployee").dialog({ autoOpen: false, width: 900, height: 500, modal: true, resizable: false });
                $("#divBrowseKPIAssign").hide();
                $("#divBrowseKPIAssign").dialog({ autoOpen: false, width: 900, height: 500, modal: true, resizable: false });

                if ($("#txt_kpi").val() == '') {
                    $("#btn_BrowseKPIAssign").attr("disabled", true);
                    $("#btn_BrowseEmployee").attr("disabled", true);
                }

                if ($("#txt_kpiassign").val() == '') {
                    $("#btn_BrowseEmployee").attr("disabled", true);
                }


                $("#btn_save").click(function () {
                    var param = "?";
                    var isActive = 'false';
                    var weightenable = 'false';
                    var uomenable = 'false';

                    $('#form1 td input:checked').each(function () {
                        var $cb = $(this);
                        if ($cb.attr('id') == 'chk_active') {
                            isActive = 'true';
                        }
                        if ($cb.attr('id') == 'chk_weightenableflag') {
                            weightenable = 'true';
                        }
                        if ($cb.attr('id') == 'chk_uomenableflag') {
                            uomenable = 'true';
                        }
                    });

                    param = param + "action=save";
                    param = param + "&ID=" + $("#txt_id").val();
                    param = param + "&isActive=" + isActive;
                    param = param + "&weightEnable=" + weightenable;
                    param = param + "&uomEnable=" + uomenable;
                    param = param + "&UOM=" + $("#txt_uomid").val();
                    param = param + "&UOMMax=" + $("#txt_uommaxid").val();
                    param = param + "&UOMMin=" + $("#txt_uomminid").val();
                    param = param + "&KPI=" + $("#txt_kpiid").val();
                    param = param + "&KPIAssign=" + $("#txt_kpiassignid").val();
                    param = param + "&Employee=" + $("#txt_employeeid").val();
                    param = param + "&Weight=" + $("#txt_weight").val();
                    param = param + "&Polarization=" + $("#txt_polarization").val();
                    param = param + "&ManualCalculation=" + $("#txt_manualcalculation").val();
                    param = param + "&CurrUser=" + $("#txt_user").val();
                    ProcessRequest("KPIAssignDetailHandler.ashx" + param.replace("undefined", ""), "#divdetail", "#KPIAssignDetailTable");
                    return false;
                });


                $("#btn_delete").click(function () {
                    if (confirm('Are you sure to delete this record?')) {
                        var param = "?";
                        param = param + "action=delete";
                        param = param + "&ID=" + $("#txt_id").val();
                        param = param + "&CurrUser=" + $("#txt_user").val();
                        ProcessRequest("KPIAssignDetailHandler.ashx" + param, "#divdetail", "#KPIAssignTable");
                        return false;
                    }
                    return false;
                });

                $("#btn_BrowseKPI").click(function () {
                    $("#divBrowseKPI").dialog("option", "title", '<span class="header-text">Select KPI</span>');
                    $("#divBrowseKPI").dialog("open");
                    $('#kpi').dataTable({
                        "oLanguage": {
                            "sZeroRecords": "No records to display",
                            "sSearch": "Search"
                        },
                        "bSort": false,
                        "bPaginate": true,
                        "bAutoWidth": true,
                        "bProcessing": true,
                        "bServerSide": true,
                        "bDestroy": true,
                        "bJQueryUI": true,
                        "sPaginationType": "full_numbers",
                        "bDeferRender": true,
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "GET",
                                "url": "../Serializer/KPISerializer.ashx?User=" + $("#txt_user").val(),
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "aoColumns": [
                        { "mData": "No" },
                        { "mData": "Description" },
                        { "mData": "isActive" },
                        { "mData": "ID" }
                    ],
                        "aoColumnDefs":
                    [
                        { "fnRender":
                            function (oObj) {
                                return "<a href=\"#\" onclick=\"PickKPI('" + oObj.aData["ID"] + "')\"><img src='../images/ok.png' /></a>";
                            },
                            "aTargets": [3]
                        },
                        { "sClass": "center", "aTargets": [0, 2, 3] },
                        { "fnRender":
                            function (oObj) {
                                if (oObj.aData["isActive"] == 'True') {
                                    return "<img src='../images/check.png' />"
                                }
                                else {
                                    return "<img src='../images/cross.png' />"
                                }
                            },
                            "aTargets": [2]
                        }
                    ]
                    });

                    //mark selected row
                    $('body').on("click", '#kpi tbody tr', function () {
                        $('#kpi tbody tr').removeClass("row_selected");
                        $(this).addClass("row_selected");
                    });
                    $(".dataTables_filter input").focus();
                    return false;
                });

                PickKPI = function (KPIID) {

                    $.ajax({
                        "dataType": 'json',
                        "type": "GET",
                        "url": "../Serializer/KPIByIDSerializer.ashx?KPI=" + KPIID,
                        "success": function (data) {
                            $("#txt_kpiid").val(KPIID);
                            $("#txt_kpi").val(data.result.Description);
                            $("#txt_weight").val(data.result.Weight);
                            $("#txt_polarization").val(data.result.Polarization);
                            if (data.result.UoM == null) {
                                $("#txt_uom").val('');
                                $("#txt_uomid").val('');
                            }
                            else {
                                $("#txt_uom").val(data.result.UoM.Description);
                                $("#txt_uomid").val(data.result.UoM.ID);
                            }

                            if (data.result.UoMDetailMax == null) {
                                $("#txt_uommax").val('');
                                $("#txt_uommaxid").val('');
                            }
                            else {
                                $("#txt_uommax").val(data.result.UoMDetailMax.Description);
                                $("#txt_uommaxid").val(data.result.UoMDetailMax.ID);
                            }

                            if (data.result.UoMDetailMin == null) {
                                $("#txt_uommin").val('');
                                $("#txt_uomminid").val('');
                            }
                            else {
                                $("#txt_uommin").val(data.result.UoMDetailMin.Description);
                                $("#txt_uomminid").val(data.result.UoMDetailMin.ID);
                            }

                            $("#txt_manualcalculation").val(data.result.ManualCalculation);

                            $("#form1 td input[type='checkbox']").each(function () {
                                var $cb = $(this);
                                if ($cb.attr('id') == 'chk_weightenableflag') {
                                    if (data.result.WeightEnableFlag.toString() == 'true')
                                        $cb.prop('checked', true);
                                }
                                if ($cb.attr('id') == 'chk_uomenableflag') {
                                    if (data.result.UoMEnableFlag.toString() == 'true')
                                        $cb.prop('checked', true);
                                }
                            });
                        }
                    });

                    $("#divBrowseKPI").dialog("close");

                    $("#btn_BrowseKPIAssign").attr("disabled", false);
                    $("#txt_kpiassign").val('');
                    $("#txt_kpiassignid").val('');
                }


                $("#btn_BrowseKPIAssign").click(function () {
                    $("#divBrowseKPIAssign").dialog("option", "title", '<span class="header-text">Select KPI Assign</span>');
                    $("#divBrowseKPIAssign").dialog("open");
                    $('#kpiassign').dataTable({
                        "oLanguage": {
                            "sZeroRecords": "No records to display",
                            "sSearch": "Search"
                        },
                        "bSort": false,
                        "bPaginate": true,
                        "bAutoWidth": true,
                        "bProcessing": true,
                        "bServerSide": true,
                        "bDestroy": true,
                        "bJQueryUI": true,
                        "sPaginationType": "full_numbers",
                        "bDeferRender": true,
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "GET",
                                "url": "../Serializer/KPIAssignByKPISerializer.ashx?KPI=" + $("#txt_kpiid").val(),
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "aoColumns": [
                        { "mData": "No" },
                        { "mData": "RGM" },
                        { "mData": "Location" },
                        { "mData": "SubBranch" },
                        { "mData": "UoM" },
                        { "mData": "Verifier" },
                        { "mData": "isActive" },
                        { "mData": "ID" }
                    ],
                        "aoColumnDefs":
                    [
                        { "fnRender":
                            function (oObj) {
                                var Description = oObj.aData["RGM"].toString();
                                if (oObj.aData["Location"].toString() != '')
                                    Description = Description + ' || ' + oObj.aData["Location"].toString();
                                if (oObj.aData["SubBranch"].toString() != '')
                                    Description = Description + ' || ' + oObj.aData["SubBranch"].toString();

                                return "<a href=\"#\" onclick=\"PickKPIAssign('" + oObj.aData["ID"] + "','" + Description + "')\"><img src='../images/ok.png' /></a>";
                            },
                            "aTargets": [7]
                        },
                        { "sClass": "center", "aTargets": [0, 6, 7] },
                        { "fnRender":
                            function (oObj) {
                                if (oObj.aData["isActive"] == 'True') {
                                    return "<img src='../images/check.png' />"
                                }
                                else {
                                    return "<img src='../images/cross.png' />"
                                }
                            },
                            "aTargets": [6]
                        }
                    ]
                    });

                    //mark selected row
                    $('body').on("click", '#kpiassign tbody tr', function () {
                        $('#kpiassign tbody tr').removeClass("row_selected");
                        $(this).addClass("row_selected");
                    });
                    $(".dataTables_filter input").focus();
                    return false;
                });

                PickKPIAssign = function (KPIAssignID, KPIAssignDescription) {
                    $("#txt_kpiassign").val(KPIAssignDescription);
                    $("#txt_kpiassignid").val(KPIAssignID);
                    $("#divBrowseKPIAssign").dialog("close");

                    $("#btn_BrowseEmployee").attr("disabled", false);
                }


                $("#btn_BrowseEmployee").click(function () {
                    $("#divBrowseEmployee").dialog("option", "title", '<span class="header-text">Select Employee</span>');
                    $("#divBrowseEmployee").dialog("open");
                    $('#employee').dataTable({
                        "oLanguage": {
                            "sZeroRecords": "No records to display",
                            "sSearch": "Search"
                        },
                        "bSort": false,
                        "bPaginate": true,
                        "bAutoWidth": true,
                        "bProcessing": true,
                        "bServerSide": true,
                        "bDestroy": true,
                        "bJQueryUI": true,
                        "sPaginationType": "full_numbers",
                        "bDeferRender": true,
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "GET",
                                "url": "../Serializer/EmployeeByKPIAssignSerializer.ashx?KPIAssign=" + $("#txt_kpiassignid").val(),
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "aoColumns": [
                        { "mData": "No" },
                        { "mData": "FirstName" },
                        { "mData": "LastName" },
                        { "mData": "Department" },
                        { "mData": "Section" },
                        { "mData": "SubSection" },
                        { "mData": "JobPosition" },
                        { "mData": "ID" }
                    ],
                        "aoColumnDefs":
                    [
                        { "fnRender":
                            function (oObj) {
                                return "<a href=\"#\" onclick=\"PickEmployee('" + oObj.aData["ID"] + "','" + oObj.aData["FirstName"] + " " + oObj.aData["LastName"] + "')\"><img src='../images/ok.png' /></a>";
                            },
                            "aTargets": [7]
                        },
                        { "sClass": "center", "aTargets": [0, 7] }
                    ]
                    });

                    //mark selected row
                    $('body').on("click", '#employee tbody tr', function () {
                        $('#employee tbody tr').removeClass("row_selected");
                        $(this).addClass("row_selected");
                    });
                    $(".dataTables_filter input").focus();
                    return false;
                });

                PickEmployee = function (EmployeeID, EmployeeName) {
                    $("#txt_employee").val(EmployeeName);
                    $("#txt_employeeid").val(EmployeeID);
                    $("#divBrowseEmployee").dialog("close");
                }
            });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div id="kpiassigndetailformarea" class="ui-widget-content padding5px ui-corner-all">
            <table class="dialogTable" width="100%">
                <tr>
                    <td width="50%">
                        <table>
                            <tr>
                                <td width="140px">ID</td>
                                <td class="Separator">:</td>
                                <td><asp:TextBox ID="txt_id" runat="server" ReadOnly="true"></asp:TextBox></td>
                            </tr>
                            <tr>
                                <td>KPI</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_kpi" runat="server" ReadOnly="true" class="longText mandatory"></asp:TextBox>
                                    <button id="btn_BrowseKPI" class="ui-button ui-state-default">
                                        <span class="ui-button ui-icon ui-icon-newwin"></span>
                                    </button>
                                    <input type="hidden" id="txt_kpiid" runat="server" />
                                </td>
                            </tr>
                            <tr>
                                <td>KPI Assign</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_kpiassign" runat="server" ReadOnly="true" class="longText mandatory"></asp:TextBox>
                                    <button id="btn_BrowseKPIAssign" class="ui-button ui-state-default">
                                        <span class="ui-button ui-icon ui-icon-newwin"></span>
                                    </button>
                                    <input type="hidden" id="txt_kpiassignid" runat="server" />
                                </td>
                            </tr>
                            <tr>
                                <td>Employee</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_employee" runat="server" ReadOnly="true" class="longText mandatory"></asp:TextBox>
                                    <button id="btn_BrowseEmployee" class="ui-button ui-state-default">
                                        <span class="ui-button ui-icon ui-icon-newwin"></span>
                                    </button>
                                    <input type="hidden" id="txt_employeeid" runat="server" />
                                </td>
                            </tr>
                            <tr>
                                <td>Weight</td>
                                <td>:</td>
                                <td><asp:TextBox ID="txt_weight" runat="server" ReadOnly="true"></asp:TextBox></td>
                            </tr>
                            <tr>
                                <td>Polarization</td>
                                <td>:</td>
                                <td><asp:TextBox ID="txt_polarization" runat="server" ReadOnly="true"></asp:TextBox></td>
                            </tr>
                            <tr>
                                <td>Manual Calculation</td>
                                <td>:</td>
                                <td><asp:TextBox ID="txt_manualcalculation" runat="server" ReadOnly="true"></asp:TextBox></td>
                            </tr>
                        </table>
                    </td>
                    <td width="50%">
                        <table>
                            <tr>
                                <td width="140px">Unit of Measure</td>
                                <td class="Separator">:</td>
                                <td>
                                    <asp:TextBox ID="txt_uom" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                    <input type="hidden" id="txt_uomid" runat="server" />
                                </td>
                            </tr>                
                            <tr>
                                <td>UoM Max</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_uommax" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                    <input type="hidden" id="txt_uommaxid" runat="server" />
                                </td>
                            </tr>          
                            <tr>
                                <td>UoM Min</td>
                                <td>:</td>
                                <td>
                                    <asp:TextBox ID="txt_uommin" runat="server" ReadOnly="true" class="longText"></asp:TextBox>
                                    <input type="hidden" id="txt_uomminid" runat="server" />
                                </td>
                            </tr>              
                            <tr>
                                <td>Weight Enable Flag</td>
                                <td>:</td>
                                <td>
                                    <asp:CheckBox ID="chk_weightenableflag" runat="server" Enabled="false"/>
                                </td>
                            </tr>
                            <tr>
                                <td>UoM Enable Flag</td>
                                <td>:</td>
                                <td>
                                    <asp:CheckBox ID="chk_uomenableflag" runat="server" Enabled="false"/>
                                </td>
                            </tr>
                            <tr>
                                <td>is Active</td>
                                <td>:</td>
                                <td><asp:CheckBox ID="chk_active" runat="server"/></td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
        </div>
        <br />
        <div id="AuditInformation" class="ui-widget-content padding5px ui-corner-all">
            <b style="margin-left:5px">Audit Information</b>
            <table class="dialogTable">
                <tr>
                    <td width="140px">Last Modified Date</td>
                    <td class="Separator">:</td>
                    <td><asp:TextBox ID="txt_lastmodifieddate" runat="server" ReadOnly="true"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>Last Modified By</td>
                    <td>:</td>
                    <td><asp:TextBox ID="txt_lastmodifiedby" runat="server" ReadOnly="true"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>Create Date</td>
                    <td>:</td>
                    <td><asp:TextBox ID="txt_createdate" runat="server" ReadOnly="true"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>Create By</td>
                    <td>:</td>
                    <td><asp:TextBox ID="txt_createby" runat="server" ReadOnly="true"></asp:TextBox></td>
                </tr>
            </table>
        </div>
        <div id="divBrowseKPI" class="ui-widget-content padding5px ui-corner-all">
            <table cellpadding="0" cellspacing="0" border="0" class="display" id="kpi">
                <thead>
                    <tr>
                        <th>
                            No
                        </th>
                        <th>
                            Description
                        </th>
                        <th>
                            is Active
                        </th>
                        <th>
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <div id="divBrowseKPIAssign" class="ui-widget-content padding5px ui-corner-all">
            <table cellpadding="0" cellspacing="0" border="0" class="display" id="kpiassign">
                <thead>
                    <tr>
                        <th>
                            No
                        </th>
                        <th>
                            RGM
                        </th>
                        <th>
                            Branch
                        </th>
                        <th>
                            Sub Branch
                        </th>
                        <th>
                            UoM
                        </th>
                        <th>
                            Verifier
                        </th>
                        <th>
                            is Active
                        </th>
                        <th>
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <div id="divBrowseEmployee" class="ui-widget-content padding5px ui-corner-all">
            <table cellpadding="0" cellspacing="0" border="0" class="display" id="employee">
                <thead>
                    <tr>
                        <th>
                            No
                        </th>
                        <th>
                            First Name
                        </th>
                        <th>
                            Last Name
                        </th>
                        <th>
                            Department
                        </th>
                        <th>
                            Section
                        </th>
                        <th>
                            Sub Section
                        </th>
                        <th>
                            Job Position
                        </th>
                        <th>
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <br />
        <button id="btn_save" class="ui-button ui-corner-all ui-button ui-state-default ui-button-text-icon-primary" runat="server" name="btnSave">
            <span class="ui-button-icon-primary ui-icon ui-icon-check"></span>
            <label class="ui-button-text">
                Save</label>
        </button>

        <button id="btn_delete" class="ui-button ui-corner-all ui-button ui-state-default ui-button-text-icon-primary" runat="server">
            <span class="ui-button-icon-primary ui-icon ui-icon-closethick"></span>
            <label class="ui-button-text">
                Delete</label>
        </button>
    </form>
</body>
</html>
